<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>签到</title>
    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/js/signin/css/bootstrap3/css/bootstrap.css">
    <link rel="stylesheet" href="/js/plugins/dialog/dialog.css">
    <link rel="stylesheet" href="/js/signin/css/style.css">
    <link rel="stylesheet" href="/js/signin/css/qiandao_style.css">
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/myInfo.css"/>
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/plugins/dialog/dialog.min.js"></script>
    <script src="/js/plugins/jrender/jrender.js"></script>
    <script src="/js/signin/js/calendar.js"></script>
</head>
<body>
<div class="search-head">
    <div class="row nav-search">
        <div class="col">
            <a href="profiles.html">
                <span><i class="fa fa-chevron-left"></i></span>
            </a>
        </div>
        <div class="col">
            <span>骡窝签到</span>
        </div>
        <div class="col">
            <span><a href="goods.html">积分商城</a></span>
        </div>
    </div>
</div>
<div class="container">
    <div class="row">
        <div class="col-xs-12 clearPadding">
            <div class="calendar">
                <div class="calenbox">
                    <div id="calendar"></div>
                </div>
                <div class="text-center">
                    <button class="btn btn-qiandao" onClick="signIn()">马上签到</button>
                </div>
            </div>
            <div class="padding10">
                <div class="font16 pb10 borderb"><strong>连续签到奖励</strong></div>
                <div class="libaolist">
                    <div class="clearfix borderb ptb10">
                        <div class="col-xs-9 clearPadding">
                            <div class="media">
                                <a class="media-left pt3" href="javascript:void(0);">
                                    <img src="/js/signin/images/dou.png" style="width:30px;height:30px;">
                                </a>
                                <div class="media-body">
                                    <div class="">礼品</div>
                                    <div class="text-muted font12">连续签到3天即可领取10积分</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-3 clearPadding text-right pt2">
                            <button class="btn btn-lingqu">领取</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="qdbox">
    <div class="text-center text-green font18"><strong>签到成功！</strong></div>
    <div class="text-center pt10">您已经连续签到&nbsp;<span class="text-green" id="day">1</span>&nbsp;天</div>
    <div class="text-center ptb15"><p>积分: +3</p></div>
    <div class="text-center">
        <button class="btn btn-lottery">确定</button>
    </div>
</div>
<script>
    function signIn() {
        $(".qdbox").fadeIn();
    }

    $(".maskbox").click(function () {
        $(".maskbox").fadeOut();
        $(".qdbox").fadeOut();
    });
    $(function () {
        var user = JSON.parse(sessionStorage.getItem("user"));
        // 绑定签到按钮点击事件, 发送ajax请求, 新增一条签到记录
        $(".btn-qiandao").click(function () {
            $.ajax({
                url: "/signins",
                data: "userId=" + user.id + "&state=1",
                type: "POST"
            });
            $(".btn-qiandao").attr("disabled", true).html("已签到");
        });
        // 发送ajax请求, 查询当前登录用户的所有签到信息
        $.get("/signins/" + user.id, function (data) {
            //ajax获取日历json数据
            var signList = $.map(data, function (ele, index) {
                return {"signDay": ele.time};
            });
            calUtil.init(signList);
            if (data.length < 3) {
                $(".btn-lingqu").attr("disabled", true);
            }
        });

        // 发送ajax请求,查询当前最新的签到信息
        $.get("/signins/" + user.id + "/state", function (data) {
            // 如果最新签到时间跟当前系统时间相同, 禁用签到按钮, 显示已签到
            if (data.time == new Date().getDate()) {
                $(".btn-qiandao").attr("disabled", true).html("已签到");
            }
            if (data.count > 1) {
                $("#day").html(data.count + 1);
            }
            $(".btn-lingqu").click(function () {
                $.ajax({
                    type: "PUT",
                    url: "/signins/" + data.id,
                    data: "integral=" + (data.integral + 10),
                    success: function () {
                        $(".btn-lingqu").attr("disabled", true).html("已领取");
                    }
                });
                $(document).dialog({
                    autoClose: 2500,
                    content: '领取成功,积分+10'
                });
            })
        });
        $(".btn-lottery").click(function () {
            window.location.reload();
        });
    });
</script>
</body>
</html>
